<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui"
      xmlns:ui="http://java.sun.com/jsf/facelets">

<ui:composition template="/WEB-INF/templates/template_interno_padrao.xhtml">
	
	
	<ui:define name="style_pagina">
		<h:outputStylesheet library="css" name="boletohtml.css" />
	</ui:define>
	
	<ui:define name="conteudo">
		
		<div class="row-fluid">
			<div class="span12" >
				<h1 style="font-size: 2.5em; margin-bottom: 20px">Altere e/ou Confirme os Dados Para Geração do Beleto</h1>
			</div>
		</div>
		
		<div class="row-fluid">
		
			<div class="span4">
				<h:form class="form-horizontal" prependId="false">
					
					  <div class="control-group">
					    <label class="control-label">Data de vencimento boleto</label>
					    <div class="controls">
					      <p:calendar id="dtVencBeleto"  value="#{geraBoletoBean.dataDoVencimento}" pages="2"  
								    pattern="dd/MM/yyyy" navigator="true" locale="pt_BR" showButtonPanel="true" 
								    required="true" requiredMessage="Entre com a data de vencimento."  >
				 				<p:ajax event="dateSelect" process="@this" update="@form :frm_boleto" />
				 				<f:convertDateTime pattern="dd/MM/yyyy"/>
				 				<f:validator validatorId="DataVencimentoBoletoValidator"/>
				 			</p:calendar>
	 						<p:message for="dtVencBeleto"/>
					    </div>
					  </div>
				
					 <div class="control-group">
					    <label class="control-label">Valor do boleto</label>
					    <div class="controls">
								<p:inputText id="vlrDoc" label=""
									value="#{geraBoletoBean.valorDoDocumento}"
									validatorMessage="Entre com o valor do documento"
									onkeypress="return validaInteiroEventoKeyPress(event)"
									onkeyup="formataOnKeyUp(event, this, MASCARA_REAL, 'D')"
									styleClass="input-medium" style=" text-align: right"
									maxlength="12">
									<p:ajax event="change" listener="#{geraBoletoBean.doValorDocumentoBoletoAlterado}" process="@this" update="@form :frm_boleto" />
									<f:validateDoubleRange minimum="0.1" />
									<f:convertNumber type="number" locale="pt_BR" minFractionDigits="2" maxFractionDigits="2" />
								</p:inputText>
								<p:message for="vlrDoc" />
							</div>
					  </div>
					<div class="control-group">
				    	<label class="control-label">Perc. juros de mora</label>
				    	<div class="controls">
				    		<div class="input-append">
								<p:inputText id="percJurosMoral" label=""
									value="#{geraBoletoBean.carteiraBancariaSelecionada.percentualJurosMora}"
									onkeypress="return validaInteiroEventoKeyPress(event)"
									onkeyup="formataOnKeyUp(event, this, MASCARA_REAL, 'D')"
									styleClass="input-mini" style="text-align: right" maxlength="6">
									maxlength="6">
									<f:convertNumber type="number" locale="pt_BR" minFractionDigits="2" maxFractionDigits="3" />
									<p:ajax event="change" listener="#{geraBoletoBean.doPercentualJurosMoraBoletoAlterado}" process="@this" update="@form :frm_boleto" />
								</p:inputText>
								<span class="add-on">%</span>
							</div>
							&nbsp;
							<div class="input-prepend">
								<span class="add-on">R$</span>
								<h:inputText id="vlrJurosMoral" label=""
									value="#{geraBoletoBean.valorJurosMora}"
									onkeypress="return validaInteiroEventoKeyPress(event)"
									onkeyup="formataOnKeyUp(event, this, MASCARA_REAL, 'D')"
									styleClass="input-small" style="text-align: right"
									disabled="true" maxlength="6">
									<f:convertNumber type="number" locale="pt_BR" minFractionDigits="2" maxFractionDigits="2" />
								</h:inputText>
							</div>
						</div>
				  	</div>	
					
					<div class="control-group">
				    	<label class="control-label">Perc. multa após venc.</label>
				    	<div class="controls">
				    		<div class="input-append">
								<p:inputText id="percMulta" label=""
									value="#{geraBoletoBean.carteiraBancariaSelecionada.percentualMulta}"
									onkeypress="return validaInteiroEventoKeyPress(event)"
									onkeyup="formataOnKeyUp(event, this, MASCARA_REAL, 'D')"
									styleClass="input-mini" style="text-align: right" maxlength="6">
									<p:ajax event="change" listener="#{geraBoletoBean.doPercentualMultaAposVencimentoBoletoAlterado}" process="@this" update="@form :frm_boleto" />
									<f:convertNumber type="number" locale="pt_BR" minFractionDigits="2" maxFractionDigits="2" />
								</p:inputText>
								<span class="add-on">%</span>
							</div>
							&nbsp;
							<div class="input-prepend">
								<span class="add-on">R$</span>
								<h:inputText id="vlrMulta" label=""
									value="#{geraBoletoBean.valorMulta}"
									onkeypress="return validaInteiroEventoKeyPress(event)"
									onkeyup="formataOnKeyUp(event, this, MASCARA_REAL, 'D')"
									styleClass="input-small" style="text-align: right"
									disabled="true" maxlength="6">
									<f:convertNumber type="number" locale="pt_BR"
										minFractionDigits="2" maxFractionDigits="2" />
								</h:inputText>
							</div>
						</div>
				  	</div>
					<div class="control-group">
					    <label class="control-label">Não receber após</label>
					    <div class="controls">
					      <div class="input-append">
							<p:inputText id="naoRecebAposXDias" label=""
									value="#{geraBoletoBean.carteiraBancariaSelecionada.naoReceberAposXDias}"
									onkeypress="return validaInteiroEventoKeyPress(event)"
									styleClass="input-mini" style="text-align: right" maxlength="4">
								<f:convertNumber type="number" locale="pt_BR" minFractionDigits="0" />
								<p:ajax event="change" process="@this" update="@form :frm_boleto" />
							</p:inputText>
							<span class="add-on">dias</span>
						</div>
					    </div>
					  </div>
					  
					
					<div class="form-actions">
						<p:button value="Voltar" outcome="/restrito/financeiro/contaareceberlistagem" styleClass="btn btn-inverse"/>
						&nbsp;
		            	<p:commandButton id="downloadLink" value="Confirmar geração do boleto" ajax="false" onclick="jQuery('#downloadLink').hide();"   icon="ui-icon-arrowthichk-1-s" styleClass="btn btn-primary" rendered="#{not geraBoletoBean.boletoFoiGerado}" >  
  							<p:fileDownload value="#{geraBoletoBean.file}" />  
						</p:commandButton>  
					</div>


				</h:form>
			</div>
				
			<div class="span8 well">
				
				<h1>Boleto modelo</h1>
				<h:form id="frm_boleto">
				
					<div class="mestre">
						<h1>CAIXA | 103-0 |</h1>
						<h2>Recibo do Pagador</h2>
						
						
						<table class="tab rec">
							<tbody>
								<tr>
									<td class="vV">
										Vencimento<br/>
										<span class="vV">
											<h:outputText value="#{geraBoletoBean.dataDoVencimento}">
									 				<f:convertDateTime pattern="dd/MM/yyyy"/>
									 		</h:outputText>
										</span>
									</td>
									<td>
										Agência/Código do Beneficiário<br/>
											<span>
												<h:outputLabel value="#{geraBoletoBean.contaBancariaSelecionada.agencia.numeroDaAgencia} #{geraBoletoBean.contaBancariaSelecionada.numeroDoConvenio}-#{geraBoletoBean.contaBancariaSelecionada.agencia.numeroDoDV}" />
											</span>
										</td>
									<td>Número do Documento<br/><span>&nbsp;</span></td>
									<td>Nosso Número/Código do Documento<br/><span>&nbsp;</span></td>
								</tr>
								<tr>
									<td>
										Valor do Documento<br/>
											<span class="vV">
												<h:outputText
	           											value="#{geraBoletoBean.valorDoDocumento}"
														style=" text-align: right" 
														maxlength="12">
													<f:convertNumber type="number" locale="pt_BR" minFractionDigits="2" maxFractionDigits="2"/>
												</h:outputText>
											</span>
									</td>
									<td>(-) Descontos<br/><span>&nbsp;</span></td>
									<td>(+) Acréscimos<br/><span>&nbsp;</span></td>
									<td>(=) Valor Cobrado<br/><span class="vV">&nbsp;</span>
									</td>
								</tr>
								</tbody>
						</table>
						
						
						<table class="infRec">
							<tbody>
								<tr>
									<td class="sacAv">Pagador</td>
									<td colspan="3">
										<span>
											#{geraBoletoBean.contaAReceberSelecionada.contrato.localPrestacaoServico.descricao}
											&nbsp;&nbsp;
											CPF/CNPJ: <h:outputText value="#{geraBoletoBean.contaAReceberSelecionada.contrato.localPrestacaoServico.cpfCnpj == null ? '000.000.000-00' : geraBoletoBean.contaAReceberSelecionada.contrato.localPrestacaoServico.cpfCnpjFormatado}" />
											<br />
											#{geraBoletoBean.contaAReceberSelecionada.contrato.localPrestacaoServico.enderecoCompletoFormatadoParaUmaLinha}<br/>&nbsp;
										</span>
									</td>
								</tr>
								<tr>
									<td>&nbsp;</td>
								</tr>
								<tr>
									<td class="sacAv">Sacador/Avalista</td>
									<td colspan="2">
										<span>
											#{geraBoletoBean.contaAReceberSelecionada.contrato.contratante.nome} &nbsp;
											CPF/CNPJ: <h:outputText value="#{geraBoletoBean.contaAReceberSelecionada.contrato.contratante.cpfCnpj == null ? '000.000.000-00' : geraBoletoBean.contaAReceberSelecionada.contrato.contratante.cpfCnpjFormatado}" />
											&nbsp;
										</span>
									</td>
								</tr>
								<tr>
									<td colspan="4"><hr class="solid"></hr></td>
								</tr>
								<tr>
									<td class="sacAv">Beneficiário</td>
									<td colspan="2">
										<span>
											#{geraBoletoBean.cedenteSelecionado.nome}<br />
											#{geraBoletoBean.cedenteSelecionado.enderecoCompletoFormatadoParaUmaLinha}
										</span>
									</td>
									<td class="lD autMecF">Autenticação Mecânica</td>
								</tr>
								
							</tbody>
						</table>
						
						<hr></hr>
						<h1>CAIXA | 103-0 |</h1>
						<h2></h2>
						
						
						<table class="tab ficha">
							<tbody>
								<tr>
									<td colspan="7">Local de Pagamento<br/><span><h:outputText id="texto_local_pagamento" value="#{geraBoletoBean.carteiraBancariaSelecionada.textoLocalDePagamento}" /></span></td>
									<td>Vencimento<br/>
										<span class="vV lD" >
											<h:outputText value="#{geraBoletoBean.dataDoVencimento}">
									 				<f:convertDateTime pattern="dd/MM/yyyy"/>
									 		</h:outputText>
										</span>
									</td>
								</tr>
								<tr>
									<td colspan="5">
										Beneficiário<br/>
										<span>
											<h:outputLabel id="nomeCedente" value="#{geraBoletoBean.cedenteSelecionado.nome}"  />
										</span>
									</td>
									<td colspan="2">
										CPF/CNPJ do Beneficiário<br/>
										<h:outputText id="numCpfCnpj" value="#{geraBoletoBean.cedenteSelecionado.cpfCnpj.numero}">
			 								<f:converter converterId="CpfCnpjConverter"/>
			 							</h:outputText>
									</td>
									<td>
										Agência/Código do Beneficiário<br/>
										<span class="lD">
											<h:outputText value="#{geraBoletoBean.contaBancariaSelecionada.agencia.numeroDaAgencia} #{geraBoletoBean.contaBancariaSelecionada.numeroDoConvenio}-#{geraBoletoBean.contaBancariaSelecionada.agencia.numeroDoDV}" />
										</span>
									</td>
								</tr>
								<tr>
									<td colspan="5">
										Endereço do Beneficiário<br/>
										<span>
											<h:outputLabel id="enderecoCedente" value="#{geraBoletoBean.cedenteSelecionado.enderecoCompletoFormatadoParaUmaLinha}"  />
										</span>
									</td>
									<td>Espécie Doc<br/><span>&nbsp;</span></td>
									<td>Aceite<br/><span>Não</span></td>
									<td>Nosso Número/Código Documento<br/><span class="lD">&nbsp;</span></td>
								</tr>
								<tr>
									<td>Uso do Banco<br/><span>&nbsp;</span></td>
									<td>CIP<br/><span>&nbsp;</span></td>
									<td>Carteira<br/><span>SR</span></td>
									<td>Espécie<br/><span>R$</span></td>
									<td>Quantidade<br/><span>&nbsp;</span></td>
									<td colspan="2">(x) Valor<br/><span>&nbsp;</span></td>
									<td>
										(=) Valor do Documento<br/>
										<span class="vV lD">
											<h:outputText
												value="#{geraBoletoBean.valorDoDocumento}"
												style=" text-align: right" maxlength="12">
												<f:convertNumber type="number" locale="pt_BR"
													minFractionDigits="2" maxFractionDigits="2" />
											</h:outputText>
										</span>
									</td>
								</tr>
								<tr>
									<td colspan="7" rowspan="5">
									
										Instruções - Texto de Responsabilidade do Beneficiário<br/><br/>
										
										<h:outputText value="Valor juros de mora" />
										&nbsp;
										<div class="input-prepend">
											<span class="add-on">R$</span>
											<h:inputText id="vlrJurosMoral" label="" 
				           							value="#{geraBoletoBean.valorJurosMora}" 
				           							onkeypress="return validaInteiroEventoKeyPress(event)"
													onkeyup="formataOnKeyUp(event, this, MASCARA_REAL, 'D')"
													styleClass="input-small"
													style="text-align: right" 
													disabled="true"
													maxlength="6">
												<f:convertNumber type="number" locale="pt_BR" minFractionDigits="2" maxFractionDigits="2"/>
											</h:inputText>
										</div>
										<br />
										<h:outputText value="Valor multa" />
										&nbsp;
										<div class="input-prepend">
											<span class="add-on">R$</span>
											<h:inputText id="vlrMulta" label="" 
				           							value="#{geraBoletoBean.valorMulta}" 
				           							onkeypress="return validaInteiroEventoKeyPress(event)"
													onkeyup="formataOnKeyUp(event, this, MASCARA_REAL, 'D')"
													styleClass="input-small"
													style="text-align: right" 
													disabled="true"
													maxlength="6">
												<f:convertNumber type="number" locale="pt_BR" minFractionDigits="2" maxFractionDigits="2"/>
											</h:inputText>
										</div>
										<br />
										<h:outputText value="Não receber após" />
										<div class="input-append">
		      								<p:inputText id="naoRecebAposXDias" label="" 
				           							value="#{geraBoletoBean.carteiraBancariaSelecionada.naoReceberAposXDias}" 
				           							onkeypress="return validaInteiroEventoKeyPress(event)"
				           							styleClass="input-mini"
													style="text-align: right" 
													disabled="true"
													maxlength="4">
												<f:convertNumber type="number" locale="pt_BR" minFractionDigits="0"/>
											</p:inputText>
											<span class="add-on">dias</span>
										</div>
									</td>
									<td>(-) Desconto/Abatimento<br/><span class="lD">&nbsp;</span></td>
								</tr>
								<tr>
									<td>(-) Outras Deduções<br/><span class="lD">&nbsp;</span></td>
								</tr>
								<tr>
									<td>(+) Mora/Multa<br/><span class="lD">&nbsp;</span></td>
								</tr>
								<tr>
									<td>(+) Outros Acréscimos<br/><span class="lD">&nbsp;</span></td>
								</tr>
								<tr>
									<td>(=) Valor Cobrado<br/><span class="vV lD">&nbsp;</span></td>
								</tr>
								<tr>
									<td rowspan="3" colspan="7">
										<table class="infRec">
											<tbody>
												<tr>
													<td class="sacAv">Pagador</td>
													<td colspan="3">
														<span>
															#{geraBoletoBean.contaAReceberSelecionada.contrato.localPrestacaoServico.descricao}
															&nbsp;&nbsp;
															CPF/CNPJ: <h:outputText value="#{geraBoletoBean.contaAReceberSelecionada.contrato.localPrestacaoServico.cpfCnpj == null ? '000.000.000-00' : geraBoletoBean.contaAReceberSelecionada.contrato.localPrestacaoServico.cpfCnpjFormatado}" />
															<br />
															#{geraBoletoBean.contaAReceberSelecionada.contrato.localPrestacaoServico.enderecoCompletoFormatadoParaUmaLinha}<br/>&nbsp;
														</span>
													</td>
												</tr>
												<tr>
													<td>&nbsp;</td>
												</tr>
												<tr>
													<td class="sacAv">Sacador/Avalista</td>
													<td colspan="2">
														<span>
															#{geraBoletoBean.contaAReceberSelecionada.contrato.contratante.nome} &nbsp;
															CPF/CNPJ: <h:outputText value="#{geraBoletoBean.contaAReceberSelecionada.contrato.contratante.cpfCnpj == null ? '000.000.000-00' : geraBoletoBean.contaAReceberSelecionada.contrato.contratante.cpfCnpjFormatado}" />
															&nbsp;
														</span>
													</td>
													<td class="codBaixa">Código de Baixa &nbsp;</td>
												</tr>
											</tbody>
										</table>
									</td>
									<td>Número do Documento<br/><span class="lD">&nbsp;</span></td>
								</tr>
								<tr>
									<td>
										Data do Documento<br/>
										<span class="lD">
											<h:outputText value="#{geraBoletoBean.dataDoDocumento}">
												<f:convertDateTime pattern="dd/MM/yyyy"/>
											</h:outputText>
										</span>
									</td>
								</tr>
								<tr>
									<td>
										Data do Processamento<br/>
										<span class="lD">
											<h:outputText value="#{geraBoletoBean.dataDoDocumento}">
												<f:convertDateTime pattern="dd/MM/yyyy"/>
											</h:outputText>
										</span>
									</td>
								</tr>
							</tbody>
						</table>
						<p class="aut">Autenticação Mecânica - Ficha de Compensação</p>
						<div class="barra">
							<div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div><div class="p1"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p1"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div><div class="p1"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p1"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div><div class="p1"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p1"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p1"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p0"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p1"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p1"></div><div class="b0"></div><div class="p1"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div><div class="p0"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p0"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p1"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p1"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p1"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p1"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div><div class="p1"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p1"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p1"></div><div class="b1"></div><div class="p1"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div><div class="p1"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div><div class="p1"></div><div class="b1"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div><div class="p1"></div><div class="b1"></div><div class="p1"></div><div class="b0"></div><div class="p1"></div><div class="b0"></div><div class="p0"></div><div class="b1"></div></div><hr>
							</hr>
						</div>
								
						
				</h:form>	
						
			</div>
		</div>
		
	</ui:define>

</ui:composition>      
	
</html>